<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
  </head>

  <body>
    <ul class="nav">
      <li>榴莲</li>
      <li>大蒜</li>
      <li>鲱鱼罐头</li>
      <li>梯子哦</li>
    </ul>
    <script>
      /*输出点出的的li索引号*/
      var lis = document.querySelector(".nav ").querySelectorAll("li");
      // for (let i = 0; i < lis.length; i++) {
      //     // lis[i].index = i;
      //     lis[i].onclick = function() {
      //         // console.log(this.index);
      //         console.log(i);
      //     }
      // }

      // 2. 利用闭包做
      for (var i = 0; i < lis.length; i++) {
        (function (i) {
          lis[i].onclick = function () {
            console.log(i);
          };
        })(i);
      }

      function fn() {
        var arr = [];
        //i为fn函数中的局部变量。
        for (var i = 0; i < 3; i++) {
          arr.push(
            (function (i) {
              return function () {
                return i;
              };
            })(i)
          );
        }
        return arr;
      }
      var b = fn();
      console.log(b);
      for (var i = 0; i < b.length; i++) {
        console.log(b[i]()); //3
      }

      function Person(userName, userAge) {
        this.userName = userName;
        this.userAge = userAge;
      }
      function Student(name, age, gender) {
        Person.call(this, name, age);
        this.gender = gender;
      }
      var student = new Student("zhangsan", 20, "男");
      console.log(
        "userName=" +
          student.userName +
          ",userAge=" +
          student.userAge +
          ",gender=" +
          student.gender
      );
    </script>
  </body>
</html>
